(function () {
	DatePicker=function (classname) {
//		var link=document.createElement("link");
//		link.rel = "stylesheet";
// 		link.type = "text/css";
// 		link.href = "datepicker/fonts/style.css";
// 		document.getElementsByTagName("head")[0].appendChild(link);
		datepicker=new init(classname);            //实例化
	}
	var StringBuffer=function () {
		this._string_=[];
	}	   		
	var addEvent=function(o,e,f){
		if(window.attachEvent){
			o.addEvent('on'+e,f);
		}
		else{
			o.addEventListener(e,f,false);
		}
	}
	var init=function (classname) {	 
//	    window.datepicker=this;  			//把datepicker定义为全局对象
		this.els=document.getElementsByClassName(classname);  //els前加this是让datepicker获取els属性 （this是datepicker）
		for(var i=0;i<this.els.length;i++){
			this.els[i].dpid="datepicker-"+(i+1);         //设置获取到的类名添加id
		}
		Date.prototype._week=function () {      //_week添加为原型对象的方法
			var d=new Date(this);          //内部类this是内部实例
			d.setDate(1);                   //设置从第一天开始
			return d.getDay();             //返回天数，getDay方法所返回的值是一个处于 0 到 6 之间的整数，它代表了一周中的某一天，0是星期天..
		}
		Date.prototype._days=function () {
			var d1=new Date(this),d2=new Date(this);        //得到当前时间
			d1.setDate(1);                             //设置时间从1开始
			d2.setDate(1);
			d2.setMonth(d2.getMonth()+1);                   //设置d2是当前获取时间的下个月
			return (d2-d1)/86400000;                       //返回当月天数（为下月减去当月的到毫秒）（除了86400000得到天数）
		}
		Date.prototype.pre_days=function () {       
			var d1=new Date(this),d2=new Date(this);     //得到当前时间   
			d1.setDate(1);
			d2.setDate(1);
			d2.setMonth(d2.getMonth()-1);
			return (d1-d2)/86400000;
		}	
		this.bind();   		                     //调用bind();this是datepicker，不能直接写datepicker因为不是在这里实例化的
	}
	
	init.prototype={                              //添加原型属性
		update_box:function (y,m) {               //修改页面的方法
			var D=this.D;                               
			if(y!=null) D.setFullYear(D.getFullYear()+y);    //如果年不等于空，getFullYear():总是返回4位完整的年份  getYear():当年份在1900~1999时返回2位数字当年份不在1900~1999范围时同getFullYear() 
			if(m!=null) D.setMonth(D.getMonth()+m); 
			var year=D.getFullYear(),month=D.getMonth(),date=D.getDate();      
			var con=[],week=['日','一','二','三','四','五','六'];
			var yue=['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'];
			var _html;
			var fn=function (a,b) {
				return "datepicker.update_box("+a+","+b+")";
			}
			_html="<div dpid='datepicker'><span dpid='datepicker' class='icon' onclick='"+fn(-1,null)+"'>&#xe901</span><span dpid='datepicker' class='icon' onclick='"+fn(null,-1)+"'>&#xe903</span>";
			_html+="<span dpid='datepicker' style='margin-left:20px;cursor:default;'>"+year+"年</span><span dpid='datepicker' style='display:inline-block;margin-left:20px;margin-right:20px;cursor:default;width:42px;'>"+yue[month]+"</span>";
			_html+="<span dpid='datepicker' class='icon' onclick='"+fn(null,1)+"'>&#xe900</span><span dpid='datepicker' class='icon' onclick='"+fn(1,null)+"'>&#xe902</span>";
			_html+="</div>";
			_html+="<table cellpadding='2' cellspacing='0' style='width:100%;margin-top:10px;'><tr>";
			for(var i=0;i<week.length;i++){
				_html+="<th dpid='datepicker' style='background:#38f;color:#fff;cursor:default;'>"+week[i]+"</th>";
			}
			_html+="</tr><tr>";
			var con=[];
			for(var i=0;i<D._week();i++){
				con.push("<td dpid='datepicker' style='color:#c3c3c3;cursor:default;'>"+(D.pre_days()-D._week()+i+1)+"</td>");
			}
			for(var i=0;i<D._days();i++){
				var str="";
				if(con.length%7==0) str="</tr>";
				if((i+1)==date)
					str+="<td class='date' onclick='datepicker.fillinput("+year+","+month+","+(i+1)+")' style='cursor:pointer;background:#38f;color:#fff;'>"+(i+1)+"</td>";
				else 
					str+="<td class='date' onclick='datepicker.fillinput("+year+","+month+","+(i+1)+")' style='cursor:pointer;'>"+(i+1)+"</td>";
				con.push(str);
			}
			var size=con.length;
			for(var i=0;i<42-size;i++){
				if(con.length%7==0) con.push("</tr><td dpid='datepicker' style='color:#c3c3c3;cursor:default;'>"+(i+1)+"</td>");
				else con.push("<td dpid='datepicker' style='color:#c3c3c3;cursor:default;'>"+(i+1)+"</td>");
			}
			_html+=con.join("")+"</tr></table>";
			this.box.innerHTML=_html;
		},
		createbox:function (el) {
			this.D=new Date();              //获取当前时间
			if(this.box!=null)this.removebox();    
			var box=document.createElement("div");
			var pos=this.getPos(el);
			box.style.cssText="position:absolute;";
			box.dpid="datepicker";
			box.className="date-picker-box";
			var s=box.style;
			s['left']=pos.x+"px";
			s['top']=pos.y+el.offsetHeight+"px";
			document.body.appendChild(box);
			this.box=box;
			this.update_box();
		},
		fillinput:function (y,m,d) {
			var s="/";
			this.els[this.curri].value=y+s+(m+1)+s+d;
		},
		removebox:function () {
			if(this.box!=null)       
			{
				document.body.removeChild(this.box);   // 
				this.box=null;
			}
		},
		bind:function () {   
			_this=this;             //this是datepicker   这里是点击后才调用function(e)这个函数，不在闭包里面了，所以不能直接用this
			addEvent(window,'click',function (e) {    //window里面的全部单击事件   绑定事件 （哪个（window是全部的），名字（事件），内容（方法做什么事））
				var t=e.target||e.srcElement;            //e是点击时间对象  target是文档节点  srcElement可以捕获当前事件作用的对象 
				if(t.dpid!=null||t.attributes.dpid!=null){      //t获取到的对象id如果不等于空或者t对象属性id不等于空
					if(t.dpid==null) return;                       
					var s=t.dpid.split("-");                  //把t获取到的id分成数组s，通过“-”分割   分割出s[0]=datepicker- 和s[1]=(i+1) 联系上25行看 
					var i=s[1]-1;	   						//i等于i
					if(i>=0) {                          
						_this.curri=i;	   				           //_this是datepicker	 	
						_this.createbox(_this.els[i]);             //调用createbox(_this.els[i])并传参数
					}
				}
				else{
					_this.removebox();
				}
			});
		},
		getPos:function (e) {
		for(var pos={x:0,y:0};e;e=e.offsetParent){
			pos.x+=e.offsetLeft;
			pos.y+=e.offsetTop;
			}
		return pos;
		}
	   		}
})();

onload=function () {
	DatePicker("date-picker");
}